import React, { Component } from 'react'
import PsrsonalFiles from './PsrsonalFiles.module.css'
import {Input,Form,Button} from 'element-react';
import axios from 'axios';

export default class PersonalFiles extends Component {
  constructor(props) {
  super(props);

  this.state = {
    labelPosition: 'right',
    PersonalInfo: {
      name: '',
      age:'',
      sex:'',
      phone:'',
      stuID: '',
      personalID:'',
      college:'',
      status:'',
      honor:"",
      punishment:"",
      personalimg:''
    }
  };
} 

componentDidMount(){
  this.query()
}

onPositionChange(value) {
  this.setState({ labelPosition: value });
}

onChange(key, value) {
  this.setState({
    form: Object.assign(this.state.PersonalInfo, { [key]: value })
  });
}

HandleBackPersonal = () =>{
  let history = this.props.history;
  history.push('/PersonalList')
}

query = () =>{
  console.log(this.props)
  let queryID = this.props.match.params.id 
  console.log(queryID)
  axios.get('/Sidebar/PersonalFiles/user/getSingleUserById/'+queryID).then((response)=>{
    console.log(response.data)
    this.setState({PersonalInfo:response.data.data})
  },
  error => {console.log('失败了',error);}
  )
}

  render() {
    return (
      <div className={PsrsonalFiles.PersonalFiles}>
        <div className='BackgroundPage'>
          <img className={PsrsonalFiles.shoollogo} src={require('./img/logo-w.png')} alt="es-lint want to get"/>
        <div className={PsrsonalFiles.PersonalInfo}>
        <Form labelPosition={this.state.labelPosition} labelWidth="100" model={this.state.PersonalInfo} className="demo-form-stacked">
        <img className={PsrsonalFiles.personalImg} src={require('./img/admin.jpg')} alt="es-lint want to get" value={this.state.personalimg}/>
        <Form.Item label="姓名" className={PsrsonalFiles.personalName}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.name} onChange={this.onChange.bind(this, 'name')}></Input>
        </Form.Item>
        <Form.Item label="性别" className={PsrsonalFiles.personalSex}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.sex} onChange={this.onChange.bind(this, 'sex')}></Input>
        </Form.Item>
        <Form.Item label="年龄" className={PsrsonalFiles.personalage}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.age} onChange={this.onChange.bind(this, 'age')}></Input>
        </Form.Item>
        <Form.Item label="身份证号" className={PsrsonalFiles.personalID}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.personalID} onChange={this.onChange.bind(this, 'personalID')}></Input>
        </Form.Item>
        <Form.Item label="学号/教工号" className={PsrsonalFiles.personalschoolID}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.stuID} onChange={this.onChange.bind(this, 'stuID')}></Input>
        </Form.Item>
        <Form.Item label="电话" className={PsrsonalFiles.personalPhone}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.phone} onChange={this.onChange.bind(this, 'phone')}></Input>
        </Form.Item>
        <Form.Item label="学院" className={PsrsonalFiles.personalCollege}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.college} onChange={this.onChange.bind(this, 'college')}></Input>
        </Form.Item>
        <Form.Item label="身份" className={PsrsonalFiles.personalStatus}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.status} onChange={this.onChange.bind(this, 'status')}></Input>
        </Form.Item>
        <Form.Item label="获奖经历" className={PsrsonalFiles.personalHonor}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.honor} onChange={this.onChange.bind(this, 'honor')}></Input>
        </Form.Item>
        <Form.Item label="惩处经历" className={PsrsonalFiles.personalPunishment}>
          <Input readOnly className={PsrsonalFiles.button_control} value={this.state.PersonalInfo.punishment} onChange={this.onChange.bind(this, 'punishment')}></Input>
        </Form.Item>
        <Button type="info" className={PsrsonalFiles.back_button} onClick={this.HandleBackPersonal}>返回</Button>
        </Form>
        </div>
        </div>
      </div>
    )
  }
}
